<template>
  <div class="set" v-loading="loading" element-loading-text="加载中...">
    <div class="btns flex-justify-end">
      <HPlainButton @click="saveSet(formRef)">保存</HPlainButton>
    </div>
    <!-- <div class="m_l"> -->
    <el-form :model="form" class="m_l1" ref="formRef" label-width="125" :rules="rules">
      <div class="flex-align-center checkboxs mb10">
        <el-form-item label="出库编码前缀" prop="outboundCodePrefix">
          <el-input
            v-model="form.outboundCodePrefix"
            class="input_code"
            maxlength="2"
            clearable
            placeholder="前缀名称"
          />
        </el-form-item>
        <!-- <el-form-item label=" " class="checkbox-item" prop="outboundCodeRule">
              <el-checkbox-group v-model="form.outboundCodeRule">
                <el-checkbox value="1">六位出库日期</el-checkbox>
                <el-checkbox value="2">八位防伪码</el-checkbox>
                <el-checkbox value="3">六位随机防窜码</el-checkbox>
              </el-checkbox-group>
            </el-form-item> -->
      </div>
      <div class="flex-align-center checkboxs mb10">
        <el-form-item label="入库编码前缀" prop="inboundCodePrefix">
          <el-input
            v-model="form.inboundCodePrefix"
            class="input_code"
            maxlength="2"
            clearable
            placeholder="前缀名称"
          />
        </el-form-item>
        <!-- <el-form-item label=" " class="checkbox-item" prop="inboundCodeRule">
              <el-checkbox-group v-model="form.inboundCodeRule">
                <el-checkbox value="1">六位出库日期</el-checkbox>
                <el-checkbox value="2">八位防伪码</el-checkbox>
                <el-checkbox value="3">六位随机防窜码</el-checkbox>
              </el-checkbox-group>
            </el-form-item> -->
      </div>
      <!-- <el-form-item label="出库库存锁定策略" class="mb10">
            <el-radio-group v-model="form.stockLockStrategy" class="badge-sel">
              <el-radio :value="1" class="check_xy">
                <div class="text_xy">不锁定</div>
              </el-radio>
              <el-radio :value="2" class="check_xy">
                <div class="text_xy">创建状态</div>
              </el-radio>
              <el-radio :value="3" class="check_xy">
                <div class="text_xy">审核状态</div>
              </el-radio>
              <el-radio :value="4" class="check_xy">
                <div class="text_xy">出库状态</div>
              </el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="一物一码">
            <div>
              <el-radio-group v-model="form.enableCode" class="badge-sel">
                <el-radio :value="true" class="check_xy">
                  <div class="text_xy">启用</div>
                </el-radio>
                <el-radio :value="false" class="check_xy">
                  <div class="text_xy">关闭</div>
                </el-radio>
              </el-radio-group>
              <p class="tips"
                >启用一物一码后，仓库出入库和盘点调拨都需要执行扫码流程，精确控制物料</p
              >
            </div>
          </el-form-item> -->
    </el-form>
    <!-- <el-form class="m_l2">
          <el-form-item label="先入后出">
            <div>
              <el-radio-group v-model="form.firstInThenOut" class="badge-sel">
                <el-radio :value="true" class="check_xy">
                  <div class="text_xy">启用</div>
                </el-radio>
                <el-radio :value="false" class="check_xy">
                  <div class="text_xy">关闭</div>
                </el-radio>
              </el-radio-group>
              <div class="tips">启用一物一码后，物料必须有入库记录后，才能出库</div>
            </div>
          </el-form-item>
          <el-form-item label="库存策略">
            <div>
              <el-radio-group v-model="form.stockStrategy" class="badge-sel">
                <el-radio :value="1" class="check_xy">
                  <div class="text_xy">有库存才可下单</div>
                </el-radio>
                <el-radio :value="2" class="check_xy">
                  <div class="text_xy">无需库存可下单</div>
                </el-radio>
              </el-radio-group>
              <div class="tips">当前库存数是否足够的时候，允许下单和发货</div>
            </div>
          </el-form-item>
          <el-form-item label="库存负数">
            <div>
              <el-radio-group v-model="form.stockNegative" class="badge-sel">
                <el-radio :value="1" class="check_xy">
                  <div class="text_xy">可为负库存</div>
                </el-radio>
                <el-radio :value="2" class="check_xy">
                  <div class="text_xy">不能为负库存</div>
                </el-radio>
              </el-radio-group>
              <div class="tips">库存负数关系到库存不够的时候是否可以发货</div>
            </div>
          </el-form-item>
        </el-form> -->
    <!-- </div> -->
  </div>
</template>

<script setup lang="ts">
  import { ref, reactive, onMounted, markRaw } from 'vue'
  import { ElMessage, ElMessageBox } from 'element-plus'
  import { Warning } from '@element-plus/icons-vue'
  import type { FormInstance } from 'element-plus'
  import { getStorerSet, saveStoreSet } from '../../../../../../../api/basic'
  import HPlainButton from "@/components/common/button/HPlainButton.vue";

  const loading = ref(false)
  const props = defineProps({
    active_name: String,
  })

  const form = reactive({
    enableCode: false,
    firstInThenOut: false,
    id: null,
    inboundCodePrefix: 'RK',
    inboundCodeRule: [],
    outboundCodePrefix: 'CK',
    outboundCodeRule: [],
    stockLockStrategy: 1,
    stockNegative: 2,
    stockStrategy: 1,
  })

  // 表单元素
  const formRef = ref<FormInstance>()

  // 验证规则
  const rules = reactive({
    outboundCodePrefix: [
      { required: true, message: '请输入前缀', trigger: 'blur' },
      {
        pattern: /^[A-Za-z1-9]{1,2}$/,
        message: '格式错误',
        trigger: 'blur',
      },
    ],
    outboundCodeRule: [
      { required: true, message: '请选择组合类型', trigger: 'blur' },
      {
        validator: (rule: any, value: string, callback: any) => {
          if (form.outboundCodeRule.length < 2) {
            callback(new Error('至少选择两种组合类型'))
          } else {
            callback()
          }
        },
        trigger: 'change',
      },
    ],
    inboundCodePrefix: [
      { required: true, message: '请输入前缀', trigger: 'blur' },
      {
        pattern: /^[A-Za-z1-9]{1,2}$/,
        message: '格式错误',
        trigger: 'blur',
      },
    ],
    inboundCodeRule: [
      { required: true, message: '请选择组合类型', trigger: 'blur' },
      {
        validator: (rule: any, value: string, callback: any) => {
          if (form.inboundCodeRule.length < 2) {
            callback(new Error('至少选择两种组合类型'))
          } else {
            callback()
          }
        },
        trigger: 'change',
      },
    ],
  })

  onMounted(() => {
    if (props.active_name == 'code') {
      getCodeSet()
    }
  })

  // 获取仓库编码设置
  const getCodeSet = async () => {
    loading.value = true
    await getStorerSet().then((res) => {
      form.enableCode = res.data.data.row.enableCode
      form.firstInThenOut = res.data.data.row.firstInThenOut
      form.id = res.data.data.row.id
      form.inboundCodePrefix = res.data.data.row.inboundCodePrefix
      // form.inboundCodeRule = res.data.data.row.inboundCodeRule.split(',')
      form.outboundCodePrefix = res.data.data.row.outboundCodePrefix
      // form.outboundCodeRule = res.data.data.row.outboundCodeRule.split(',')
      // form.stockLockStrategy = res.data.data.row.stockLockStrategy
      // form.stockNegative = res.data.data.row.stockNegative
      // form.stockStrategy = res.data.data.row.stockStrategy
    })
    loading.value = false
  }

  // 保存仓库编码设置
  const saveSet = (formEl: FormInstance | undefined) => {
    formEl.validate((valid) => {
      if (valid) {
        const data = {
          enableCode: form.enableCode,
          firstInThenOut: form.firstInThenOut,
          id: form.id,
          inboundCodePrefix: form.inboundCodePrefix,
          // inboundCodeRule: form.inboundCodeRule.join(),
          outboundCodePrefix: form.outboundCodePrefix,
          // outboundCodeRule: form.outboundCodeRule.join(),
          // stockLockStrategy: form.stockLockStrategy,
          // stockNegative: form.stockNegative,
          // stockStrategy: form.stockStrategy,
        }
        ElMessageBox({
          type: 'warning',
          title: '提示',
          icon: markRaw(Warning),
          message: `确认保存修改的设置?`,
          showCancelButton: true,
          closeOnClickModal: false,
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          beforeClose: (action, instance, done) => {
            if (action === 'confirm') {
              instance.confirmButtonLoading = true
              instance.confirmButtonText = '加载中...'
              setTimeout(() => {
                done()
                setTimeout(() => {
                  instance.confirmButtonLoading = false
                }, 0)
              }, 1000)
            } else {
              done()
            }
          },
        }).then(async () => {
          await saveStoreSet(data).then((res) => {
            if (res.data.success) {
              ElMessage({
                message: res.data.message,
                type: 'success',
                duration: 2000,
              })
            } else {
              if(res.data.isError) ElMessage({
                message: res.data.message,
                type: 'warning',
                duration: 2000,
              })
            }
          })
          getCodeSet()
        })
      } else {
        return
      }
    })
  }

  defineExpose({ getCodeSet })
</script>

<style scoped lang="scss">
  @import '../../index.scss';
</style>
